<template>
	<div class="page-cell">
		<div class="page-title">
			<mt-cell-swipe
				v-for="n in 10"
				:right="rightButtoms"
				:left="leftButtons"
				title="swipe me"
			>
				
			</mt-cell-swipe>
		</div>
	</div>
</template>

<script>
// eslint-disable-next-line
/* eslint-disable */
	export default {
		name: 'cellSwipe',
		data() {
			return {

			}
		},
		created(){
			this.rightButtoms = [
				{
					content: "Mark as Unread",
					style: { background: 'lightgray', color: '#fff' }
				},
				{
					content: 'Delete',
					style: { background: 'red', color: '#fff' },
					handler: ()=> this.$messagebox('delete')
				}
			],
			this.leftButtons = [
				{
					content: "done",
					style: { background: 'green', color: "#fff" }
				},
				{
					content: "undone",
					style: { background: 'red', color: '#fff' }
				}
			]
		},
		methods: {
			leftButtonHandler(evt) {
				console.log('123')
			}
		}
	}
</script>